<template>
	<view class="container">
		<view class="square">
			<view class="text">
				<image src="https://yuehuiba.qiyedaishu.com/img/logo.png?v=1" class="logo"></image>
				<view style="color: #000;font-size: 36rpx; font-weight: bold; margin-top:20rpx;">郑青春 ● 约会吧</view>
				<view style="color: #000;font-size: 30rpx; margin-top:20rpx;">党政引领 青年公益相亲交友数智平台</view>
			</view>
			<button class="login" @click="Login"><image src="/static/wx.png"/><view>微信授权登陆</view></button>
			<view class="cancel" @click="Cancel">取消登陆</view>
		</view>
		<view class="dialog" v-if="Show">
			<view class="meng"></view>
			<view class="alert">
				<view class="title">温馨提示</view>
				<view class="tip">郑重声明，实名认证后，公益红娘服务无论是线上还是线下<font class='green'>1对1</font>都是全程<font class='green'>免费</font>的。</view>
				<view class="btn" @click="CloseDialog">我知道了</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Lat:0,
				Lng:0,
				Code:'',
				Show:true
			};
		},
		onLoad() {
			uni.getLocation({
			  type: 'wgs84', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
			  success: res=> {
			    this.Lat = res.latitude; // 纬度，浮点数，范围为90 ~ -90
			    this.Lng = res.longitude; // 经度，浮点数，范围为180 ~ -180。	
			  }
			});
		},
		methods:{
			CloseDialog(){
				this.Show=false;
			},
			Login(){
				this.Util.Loading("请稍候...");
				uni.getUserProfile({
					desc: '微信登录',
					success: (user) => {//这里请求接口
						uni.login({
							provider: 'weixin',
							success: (res) => {
								this.Util.HideLoading();
								this.Code = res.code;  //微信临时登录凭证		
								var data = {};
								data.Act="Login_Xcx";
								data.Code = this.Code;
								data.Lat = this.Lat;
								data.Lng = this.Lng;
								this.Util.Post(data, json=>{
									this.Util.HideLoading();
									uni.setStorageSync("OpenID", json.Data.Info.OpenID);
									uni.setStorageSync("Token", json.Data.Info.Token);
									uni.setStorageSync("UserID", json.Data.Info.ID);
									uni.setStorageSync("Role", json.Data.Info.Role);
									uni.setStorageSync("IsIdentify", json.Data.Info.IsIdentify);
									uni.setStorageSync("IsAdmin", json.Data.Info.IsAdmin);
									if(json.Data.Info.Mobile==''){
										uni.navigateTo({
											url:"/pages/login/checkrole"
										})										
									}else{
										uni.navigateBack({
											delta:1
										})
									}
									uni.$emit("Success");
								});
							},						
							fail: (err) => {
							}
						})		
					},
					fail: () => {
						uni.showToast({title:"微信登录授权失败",icon:"none"});
					}
				})
					
			},
			BindMobile(e){
				var data = {};
				data.Act="Find_XcxPhone";
				data.Iv = e.detail.iv;
				data.EncryptedData = e.detail.encryptedData;
				this.Util.Loading("请稍候...");
				this.Util.Post(data, json=>{
					uni.navigateBack({
					  delta:1
					})
					uni.$emit("Success");
				});
			},
			Cancel(){
				uni.setStorageSync("Cancel","true");
				uni.navigateBack({
					delta:1
				})
				setTimeout(item=>{
					uni.setStorageSync("Cancel","false"); 
				},3000);
			}
		}
	}
</script>

<style lang="scss">	
	page{background-image: url(https://yuehuiba.qiyedaishu.com/img/bg4.png); overflow: hidden; background-size: 100%; background-repeat: no-repeat;}
	.square{ width:600rpx; height:calc(100vh - 500rpx); margin:0 auto; margin-top:250rpx; background-color: #ffffff; opacity: 0.8; border-radius: 40rpx;
		.text{width:100%; height:340rpx;  float:left; text-align: center; font-size:26rpx;
			.logo{width: 200rpx;height: 200rpx;margin: 120rpx auto 0; border-radius: 40rpx;}
		}
		.login{width:86%; height: 100rpx; line-height: 100rpx; margin-top:200rpx;  color:#fff; margin-left:7%; float:left; background-color: #03c239; border-radius:50rpx;}
		.login image{float:left; margin-top:25rpx; width:60rpx; height:60rpx; margin-left:90rpx;}
		.login view{float:left; font-size:36rpx; padding-left:20rpx;}
		.cancel{width:100%; height: 200rpx; line-height: 200rpx; float:left; text-align: center; color:#a8a8a8;}
		.phonelogin{width:100%; height:100%;
			.meng{width:100%; height:100%; position:absolute; top:0rpx; left:0rpx; background-color: #000000; opacity: 0.5;}
			.phone{width:450rpx; height:300rpx; position: absolute; left:150rpx; top:calc(50vh - 150rpx); background-color: #ffffff; border-radius: 20rpx; 
				.title{width:100%; height:100rpx; padding-top:30rpx; text-align: center; font-size:38rpx; font-weight: bold;}
				.tip{width:100%; height:80rpx; text-align: center; font-size:32rpx; color:#999999; }
				.btn{width:100%; height:90rpx; text-align: center;
					button{width:80%; height: 90rpx; line-height: 90rpx; font-size:38rpx; color:#fff; margin-left:10%; float:left; background-color: #3598fc; border-radius:50rpx;}
				}
			}
			
		}
	}
</style>
